﻿<!DOCTYPE html>

<html>
<!--<![endif]-->
<head>
    <!-- Basic Page Needs
      ================================================== -->
    <meta charset="utf-8">
    <title>Shopholic</title>
    <!-- SEO Meta
      ================================================== -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="description" content="">
    <meta name="keywords" content="">
    <meta name="distribution" content="global">
    <meta name="revisit-after" content="2 Days">
    <meta name="robots" content="ALL">
    <meta name="rating" content="8 YEARS">
    <meta name="Language" content="en-us">
    <meta name="GOOGLEBOT" content="NOARCHIVE">
    <!-- Mobile Specific Metas
      ================================================== -->
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <!-- CSS
      ================================================== -->
    <link rel="stylesheet" type="text/css" href="css/custom.css?v=1.3">
    <link rel="stylesheet" type="text/css" href="css/responsive.css?v=1.3">
    <link rel="shortcut icon" href="images/favicon.png">
    <link rel="apple-touch-icon" href="images/apple-touch-icon.png">
    <link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png">
    <link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png">
</head>
<body class="product-page">
<div class="se-pre-con"></div>
<div class="main">

    <!-- PRODUCT-POPUP START -->
    <div id="product_popup" class="quick-view-popup white-popup-block mfp-hide popup-position ">
        <div class="popup-detail">
            <div class="container">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="row">
                            <div class="col-lg-5 col-md-5 mb-xs-30">
                                <div class="fotorama" data-nav="thumbs" data-allowfullscreen="native">
                                    <a href="#"><img src="images/1.jpg" alt="Shopholic"></a>
                                    <a href="#"><img src="images/2.jpg" alt="Shopholic"></a>
                                    <a href="#"><img src="images/3.jpg" alt="Shopholic"></a>
                                    <a href="#"><img src="images/4.jpg" alt="Shopholic"></a>
                                    <a href="#"><img src="images/5.jpg" alt="Shopholic"></a>
                                    <a href="#"><img src="images/6.jpg" alt="Shopholic"></a>
                                    <a href="#"><img src="images/4.jpg" alt="Shopholic"></a>
                                    <a href="#"><img src="images/5.jpg" alt="Shopholic"></a>
                                    <a href="#"><img src="images/6.jpg" alt="Shopholic"></a>
                                </div>
                            </div>
                            <div class="col-lg-7 col-md-7">
                                <div class="row">
                                    <div class="col-12">
                                        <div class="product-detail-main">
                                            <div class="product-item-details">
                                                <h1 class="product-item-name">Cross Colours Camo Print Tank half
                                                    mengo</h1>
                                                <div class="rating-summary-block">
                                                    <div title="53%" class="rating-result"><span
                                                            style="width:53%"></span></div>
                                                </div>
                                                <div class="price-box"><span class="price"></span>
                                                    <del class="price old-price">$120.00</del>
                                                </div>
                                                <div class="product-info-stock-sku">
                                                    <div>
                                                        <label>Availability: </label>
                                                        <span class="info-deta">In stock</span>
                                                    </div>
                                                    <div>
                                                        <label>SKU: </label>
                                                        <span class="info-deta">20MVC-18</span>
                                                    </div>
                                                </div>
                                                <hr class="mb-20">
                                                <p>Proin lectus ipsum, gravida et mattis vulputate, tristique ut lectus.
                                                    Sed et lorem nunc. Vestibulum ante ipsum primis in faucibus orci
                                                    luctus.</p>
                                                <ul class="product-list">
                                                    <li><i class="fa fa-check"></i> Satisfaction 100% Guaranteed</li>
                                                    <li><i class="fa fa-check"></i> Free shipping on orders over $99
                                                    </li>
                                                    <li><i class="fa fa-check"></i> 14 day easy Return</li>
                                                </ul>
                                                <hr class="mb-20">
                                                <div class="mb-20">
                                                    <div class="row">
                                                        <div class="col-12">
                                                            <div class="row">
                                                                <div class="col-lg-3 col-md-12">
                                                                    <span>Select Size :</span>
                                                                </div>
                                                                <div class="col-lg-9 col-md-12">
                                                                    <div class="select-size">
                                                                        <ul class="listing">
                                                                            <li>
                                                                                <span>S</span>
                                                                            </li>
                                                                            <li class="active">
                                                                                <span>M</span>
                                                                            </li>
                                                                            <li>
                                                                                <span>L</span>
                                                                            </li>
                                                                            <li>
                                                                                <span>XL</span>
                                                                            </li>
                                                                            <li>
                                                                                <span>XXl</span>
                                                                            </li>
                                                                        </ul>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="col-12">
                                                            <div class="row">
                                                                <div class="col-lg-3 col-md-12">
                                                                    <span>Select Color :</span>
                                                                </div>
                                                                <div class="col-lg-9 col-md-12">
                                                                    <div class="select-color">
                                                                        <ul class="listing">
                                                                            <li>
                                                                                <div class="color-tooltip">
                                                                                    <span class="color-arrow"></span>Orange
                                                                                </div>
                                                                                <span class="color-option orange"></span>
                                                                            </li>
                                                                            <li>
                                                                                <div class="color-tooltip">
                                                                                    <span class="color-arrow"></span>Black
                                                                                </div>
                                                                                <span class="color-option black"></span>
                                                                            </li>
                                                                            <li>
                                                                                <div class="color-tooltip">
                                                                                    <span class="color-arrow"></span>Green
                                                                                </div>
                                                                                <span class="color-option green"></span>
                                                                            </li>
                                                                            <li>
                                                                                <div class="color-tooltip">
                                                                                    <span class="color-arrow"></span>Pink
                                                                                </div>
                                                                                <span class="color-option pink"></span>
                                                                            </li>
                                                                            <li>
                                                                                <div class="color-tooltip">
                                                                                    <span class="color-arrow"></span>Blue
                                                                                </div>
                                                                                <span class="color-option blue"></span>
                                                                            </li>
                                                                            <li>
                                                                                <div class="color-tooltip">
                                                                                    <span class="color-arrow"></span>Red
                                                                                </div>
                                                                                <span class="color-option red"></span>
                                                                            </li>
                                                                        </ul>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="col-12">
                                                            <div class="row">
                                                                <div class="col-lg-3 col-md-12">
                                                                    <span>Qty:</span>
                                                                </div>
                                                                <div class="col-lg-9 col-md-12">
                                                                    <div class="custom-qty">
                                                                        <button onclick="var result = document.getElementById('qty1'); var qty1 = result.value; if( !isNaN( qty1 ) &amp;&amp; qty1 &gt; 1 ) result.value--;return false;"
                                                                                class="reduced items" type="button"><i
                                                                                class="fa fa-minus"></i></button>
                                                                        <input type="text" class="input-text qty"
                                                                               title="Qty" value="1" maxlength="8"
                                                                               id="qty1" name="qty">
                                                                        <button onclick="var result = document.getElementById('qty1'); var qty1 = result.value; if( !isNaN( qty1 )) result.value++;return false;"
                                                                                class="increase items" type="button"><i
                                                                                class="fa fa-plus"></i></button>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <hr class="mb-20">
                                                <div class="mb-20">
                                                    <div class="bottom-detail cart-button responsive-btn">
                                                        <ul>
                                                            <li class="pro-cart-icon">
                                                                <a href="cart.html" title="Add to Cart"
                                                                   class="btn btn-color"><span></span> Add to Cart</a>
                                                            </li>
                                                            <li class="pro-wishlist-icon"><a href="wishlist.html"
                                                                                             title="Wishlist"><span></span>
                                                                Wishlist</a></li>
                                                            <li class="pro-compare-icon"><a href="compare.html"
                                                                                            title="Compare"><span></span>
                                                                Compare</a></li>
                                                            <li class="pro-email-icon"><a href="#"
                                                                                          title="Email to Friends"><span></span>
                                                                Email to Friends</a></li>
                                                        </ul>
                                                    </div>
                                                </div>
                                                <div class="share-link">
                                                    <label>Share This : </label>
                                                    <div class="social-link">
                                                        <ul class="social-icon">
                                                            <li><a class="facebook" title="Facebook" href="#"><i
                                                                    class="fa fa-facebook"> </i></a></li>
                                                            <li><a class="twitter" title="Twitter" href="#"><i
                                                                    class="fa fa-twitter"> </i></a></li>
                                                            <li><a class="linkedin" title="Linkedin" href="#"><i
                                                                    class="fa fa-linkedin"> </i></a></li>
                                                            <li><a class="rss" title="RSS" href="#"><i
                                                                    class="fa fa-rss"> </i></a></li>
                                                            <li><a class="pinterest" title="Pinterest" href="#"><i
                                                                    class="fa fa-pinterest"> </i></a></li>
                                                        </ul>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- PRODUCT-POPUP END -->

    <!-- HEADER START -->
    <script src="js/head.js"></script>
    <!-- HEADER END -->

    <!-- Bread Crumb STRAT -->
    <div class="banner inner-banner1">
        <div class="container">
            <section class="banner-detail center-xs">
                <h1 class="banner-title">Women</h1>
                <div class="bread-crumb right-side float-none-xs">
                    <ul>
                        <li><a href="index.html"><i class="fa fa-home"></i>Home</a>/</li>
                        <li><span>Women</span></li>
                    </ul>
                </div>
            </section>
        </div>
    </div>
    <!-- Bread Crumb END -->

    <!-- CONTAIN START -->
    <section class="pt-60">
        <div class="container">
            <div class="row mlr_-20">
                <div class="col-lg-9 plr-20">

                    <div class="row mlr_-20">
                        <div class="col-lg-5 col-md-5 mb-xs-30 plr-20" id="goodsImages">
                            <!--<div id="goodsimage" class="fotorama" data-nav="thumbs" data-allowfullscreen="native">

                                <a href="#"><img src="images/2.jpg" alt="Shopholic"></a>
                                <a href="#"><img src="images/3.jpg" alt="Shopholic"></a>
                                <a href="#"><img src="images/4.jpg" alt="Shopholic"></a>
                                <a href="#"><img src="images/5.jpg" alt="Shopholic"></a>
                                <a href="#"><img src="images/6.jpg" alt="Shopholic"></a>
                                <a href="#"><img src="images/4.jpg" alt="Shopholic"></a>
                                <a href="#"><img src="images/5.jpg" alt="Shopholic"></a>
                                <a href="#"><img src="images/6.jpg" alt="Shopholic"></a>
                            </div>-->
                        </div>
                        <div class="col-lg-7 col-md-7 plr-20">
                            <div class="row">
                                <div class="col-12">
                                    <div class="product-detail-main">
                                        <div class="product-item-details">
                                            <h1 class="product-item-name" id="goodsName"><!--商品名称添加处--></h1>
                                            <span  id="goodsId" style="display: none"></span>
                                            <div class="rating-summary-block">
                                                <div title="53%" class="rating-result"><span style="width:53%"></span>
                                                </div>
                                            </div>
                                            <div class="price-box">
                                                <span class="price" id="goodsPrice"><!--商品价钱添加处--></span>
                                                <del class="price old-price" id="goods_price"><!--商品打折前价钱打折处--></del>
                                            </div>
                                            <div class="product-info-stock-sku">
                                                <div>
                                                    <label>库存: </label>
                                                    <span class="info-deta">有货</span>
                                                </div>
                                                <div>
                                                    <label>SKU: </label>
                                                    <span class="info-deta">20MVC-18</span>
                                                </div>
                                            </div>
                                            <hr class="mb-20">
                                            <ul class="product-list">
                                                <li><i class="fa fa-check"></i> 满意100％保证</li>
                                                <li><i class="fa fa-check"></i> 订单满$ 99免运费</li>
                                                <li><i class="fa fa-check"></i> 14天轻松退货</li>
                                            </ul>
                                            <hr class="mb-20">
                                            <div class="mb-20">
                                                <div class="row">
                                                    <!--商品大小、颜色、数量-->
                                                    <!--<div class="col-12">
                                                        <div class="row">
                                                            <div class="col-lg-4 col-md-12">
                                                                <span>Select Size :</span>
                                                            </div>
                                                            <div class="col-lg-8 col-md-12">
                                                                <div class="select-size">
                                                                    <ul class="listing">
                                                                        <li>
                                                                            <span>S</span>
                                                                        </li>
                                                                        <li class="active">
                                                                            <span>M</span>
                                                                        </li>
                                                                        <li>
                                                                            <span>L</span>
                                                                        </li>
                                                                        <li>
                                                                            <span>XL</span>
                                                                        </li>
                                                                        <li>
                                                                            <span>XXl</span>
                                                                        </li>
                                                                    </ul>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="col-12">
                                                        <div class="row">
                                                            <div class="col-lg-4 col-md-12">
                                                                <span>Select Color :</span>
                                                            </div>
                                                            <div class="col-lg-8 col-md-12">
                                                                <div class="select-color">
                                                                    <ul class="listing">
                                                                        <li>
                                                                            <div class="color-tooltip">
                                                                                <span class="color-arrow"></span>Orange
                                                                            </div>
                                                                            <span class="color-option orange"></span>
                                                                        </li>
                                                                        <li>
                                                                            <div class="color-tooltip">
                                                                                <span class="color-arrow"></span>Black
                                                                            </div>
                                                                            <span class="color-option black"></span>
                                                                        </li>
                                                                        <li>
                                                                            <div class="color-tooltip">
                                                                                <span class="color-arrow"></span>Green
                                                                            </div>
                                                                            <span class="color-option green"></span>
                                                                        </li>
                                                                        <li>
                                                                            <div class="color-tooltip">
                                                                                <span class="color-arrow"></span>Pink
                                                                            </div>
                                                                            <span class="color-option pink"></span>
                                                                        </li>
                                                                        <li>
                                                                            <div class="color-tooltip">
                                                                                <span class="color-arrow"></span>Blue
                                                                            </div>
                                                                            <span class="color-option blue"></span>
                                                                        </li>
                                                                        <li>
                                                                            <div class="color-tooltip">
                                                                                <span class="color-arrow"></span>Red
                                                                            </div>
                                                                            <span class="color-option red"></span>
                                                                        </li>
                                                                    </ul>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="col-12">
                                                        <div class="row">
                                                            <div class="col-lg-4 col-md-12">
                                                                <span>Qty:</span>
                                                            </div>
                                                            <div class="col-lg-8 col-md-12">
                                                                <div class="custom-qty">
                                                                    <button onclick="var result = document.getElementById('qty'); var qty = result.value; if( !isNaN( qty ) &amp;&amp; qty &gt; 1 ) result.value&#45;&#45;;return false;"
                                                                            class="reduced items" type="button"><i
                                                                            class="fa fa-minus"></i></button>
                                                                    <input type="text" class="input-text qty"
                                                                           title="Qty" value="1" maxlength="8" id="qty"
                                                                           name="qty">
                                                                    <button onclick="var result = document.getElementById('qty'); var qty = result.value; if( !isNaN( qty )) result.value++;return false;"
                                                                            class="increase items" type="button"><i
                                                                            class="fa fa-plus"></i></button>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>-->
                                                    <div class="col-12">
                                                        <div class="bottom-detail cart-button">
                                                            <ul>
                                                                <li class="pro-cart-icon">
                                                                    <a id="addToCart" title="添加购物车"
                                                                       class="btn btn-color"><span></span> 添加购物车</a>
                                                                </li>
                                                            </ul>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <hr class="mb-20">
                                            <div class="mb-20">
                                                <div class="bottom-detail cart-button">
                                                    <ul>
                                                        <li class="pro-wishlist-icon"><a href="wishlist.html"
                                                                                         title="Wishlist"><span></span>
                                                            Wishlist</a></li>
                                                        <li class="pro-compare-icon"><a href="compare.html"
                                                                                        title="Compare"><span></span>
                                                            Compare</a></li>
                                                        <li class="pro-email-icon"><a href="#" title="Email to Friends"><span></span>
                                                            Email to Friends</a></li>
                                                    </ul>
                                                </div>
                                            </div>
                                            <div class="share-link">
                                                <label>Share This : </label>
                                                <div class="social-link">
                                                    <ul class="social-icon">
                                                        <li><a class="facebook" title="Facebook" href="#"><i
                                                                class="fa fa-facebook"> </i></a></li>
                                                        <li><a class="twitter" title="Twitter" href="#"><i
                                                                class="fa fa-twitter"> </i></a></li>
                                                        <li><a class="linkedin" title="Linkedin" href="#"><i
                                                                class="fa fa-linkedin"> </i></a></li>
                                                        <li><a class="rss" title="RSS" href="#"><i
                                                                class="fa fa-rss"> </i></a></li>
                                                        <li><a class="pinterest" title="Pinterest" href="#"><i
                                                                class="fa fa-pinterest"> </i></a></li>
                                                    </ul>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
                <div class="col-lg-3 d-none d-lg-block plr-20">
                    <div class="brand-logo-pro align-center mb-30">
                        <img src="images/brand5.png" alt="Shopholic">
                    </div>
                    <div class="sub-banner-block align-center">
                        <img src="images/pro-banner.jpg" alt="Shopholic">
                    </div>
                </div>
            </div>
        </div>
    </section>


  <section class="ptb-60">
    <div class="container">
      <div class="product-detail-tab">
        <div class="row">
          <div class="col-lg-12">
            <div id="tabs">
              <ul class="nav nav-tabs">
                <li><a class="tab-Description selected" title="Description">Description</a></li>
                <li><a class="tab-Product-Tags" title="Product-Tags">Product-Tags</a></li>
                <li><a class="tab-Reviews" title="Reviews" id="getMsg">评论</a></li>
              </ul>
            </div>
            <div id="items">
              <div class="tab_content">
                <ul>
                  <li>
                    <div class="items-Description selected ">
                      <div class="Description"> <strong>The standard Lorem Ipsum passage, used since the 1500s</strong><br />
                        <p>Proin lectus ipsum, gravida et mattis vulputate, tristique ut lectus. Sed et lorem nunc. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aenean eleifend laoreet congue. Vivamus adipiscing nisl ut dolor dignissim semper. Nulla luctus malesuada Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy  took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into Shopholicnic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets</p>
                        <p>Tristique ut lectus. Sed et lorem nunc. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aenean eleifend laoreet congue. Vivamus adipiscing nisl ut dolor dignissim semper. Nulla luctus malesuada Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
                      </div>
                    </div>
                  </li>
                  <li>
                    <div class="items-Product-Tags"><strong>Section 1.10.32 of "de Finibus Bonorum et Malorum", written by Cicero in 45 BC</strong><br />
                      Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur</div>
                  </li>
                  <li id="pinglunli">
                    <div class="items-Reviews" href="">
                      <div class="comments-area">
                        <h4>评论条数<span>(2)</span></h4>
                        <ul class="comment-list mt-30" id="aaa" >
                        </ul>
                      </div>
                      <div class="main-form mt-30">
                        <h4>发布评论</h4>
                        <form >
                          <div class="row mt-30 mlr_-20" id="oldpinglun">
                            <!--                            <div class="col-md-4 mb-20 plr-20">
                                                          <input type="text" placeholder="Name" required>
                                                        </div>
                                                        <div class="col-md-4 mb-20 plr-20">
                                                          <input type="email" placeholder="Email" required>
                                                        </div>
                                                        <div class="col-md-4 mb-20 plr-20">
                                                          <input type="text" placeholder="Website" required>
                                                        </div>-->

                            <div class="col-12 mb-20 plr-20">
                              <textarea cols="30" rows="3" id="MsgContent" placeholder="发布信息" required></textarea>
                            </div>
                            <div class="col-12 plr-20">
                              <button type="button" class="btn btn-color" name="submit" id="submit" >提交</button>
                            </div>

                          </div>
                        </form>
                      </div>
                    </div>
                  </li>
                </ul>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

  </section>

  <section class="pb-60">
    <div class="container">
      <div class="product-listing grid-type">
        <div class="row">
          <div class="col-12">
            <div class="heading-part line-bottom mb-20">
              <h2 class="main_title heading"><span>Related Products</span></h2>
            </div>
          </div>
        </div>
        <div class="pro_cat">
          <div class="row mlr_-20">
            <div class="owl-carousel pro-cat-slider">
              <div class="item plr-20">
                <div class="product-item">
                  <div class="main-label sale-label"><span>Sale</span></div>
                  <div class="product-item-inner">
                    <div class="product-image">
                      <a href="product-page.html">
                        <img src="images/1.jpg" alt="Shopholic">
                      </a>
                    </div>
                    <div class="product-item-details">
                      <div class="product-item-name">
                        <a href="product-page.html">Samsung Galexy Tab</a>
                      </div>
                      <div class="price-box">
                        <span class="price">$80.00</span>
                        <del class="price old-price">$120.00</del>
                      </div>
                      <div class="rating-summary-block">
                        <div class="rating-result" title="53%">
                          <span style="width:53%"></span>
                        </div>
                      </div>
                      <div class="product-detail-inner">
                        <div class="detail-inner-left align-center">
                          <ul>
                            <li class="pro-cart-icon">
                              <a href="cart.html" title="Add to Cart">
                                <span></span>
                              </a>
                            </li>
                            <li class="pro-wishlist-icon">
                              <a href="wishlist.html" title="Wishlist">
                                <span></span>
                              </a>
                            </li>
                            <li class="pro-compare-icon">
                              <a href="compare.html" title="Compare">
                                <span></span>
                              </a>
                            </li>
                          </ul>
                        </div>
                      </div>
                    </div>
                  </div>
                  <div class="quick-view">
                    <a class="popup-with-product btn btn-color" href="#product_popup" title="quick-view">
                      <i class="fa fa-eye"></i> Quick View
                    </a>
                  </div>
                </div>
              </div>
              <div class="item plr-20">
                <div class="product-item">
                  <div class="product-item-inner">
                    <div class="product-image">
                      <div class="main-label new-label"><span>New</span></div>
                      <a href="product-page.html">
                        <img src="images/2.jpg" alt="Shopholic">
                      </a>
                    </div>
                    <div class="product-item-details">
                      <div class="product-item-name">
                        <a href="product-page.html">iPhone 6s (Black)</a>
                      </div>
                      <div class="price-box">
                        <span class="price">$80.00</span>
                        <del class="price old-price">$120.00</del>
                      </div>
                      <div class="rating-summary-block">
                        <div class="rating-result" title="53%">
                          <span style="width:53%"></span>
                        </div>
                      </div>
                      <div class="product-detail-inner">
                        <div class="detail-inner-left align-center">
                          <ul>
                            <li class="pro-cart-icon">
                              <a href="cart.html" title="Add to Cart">
                                <span></span>
                              </a>
                            </li>
                            <li class="pro-wishlist-icon">
                              <a href="wishlist.html" title="Wishlist">
                                <span></span>
                              </a>
                            </li>
                            <li class="pro-compare-icon">
                              <a href="compare.html" title="Compare">
                                <span></span>
                              </a>
                            </li>
                          </ul>
                        </div>
                      </div>
                    </div>
                  </div>
                  <div class="quick-view">
                    <a class="popup-with-product btn btn-color" href="#product_popup" title="quick-view">
                      <i class="fa fa-eye"></i> Quick View
                    </a>
                  </div>
                </div>
              </div>
              <div class="item plr-20">
                <div class="product-item">
                  <div class="product-item-inner">
                    <div class="product-image">
                      <div class="main-label sale-label"><span>Sale</span></div>
                      <div class="main-label new-label"><span>New</span></div>
                      <a href="product-page.html">
                        <img src="images/3.jpg" alt="Shopholic">
                      </a>
                    </div>
                    <div class="product-item-details">
                      <div class="product-item-name">
                        <a href="product-page.html">iBall Headphone</a>
                      </div>
                      <div class="price-box">
                        <span class="price">$80.00</span>
                        <del class="price old-price">$120.00</del>
                      </div>
                      <div class="rating-summary-block">
                        <div class="rating-result" title="53%">
                          <span style="width:53%"></span>
                        </div>
                      </div>
                      <div class="product-detail-inner">
                        <div class="detail-inner-left align-center">
                          <ul>
                            <li class="pro-cart-icon">
                              <a href="cart.html" title="Add to Cart">
                                <span></span>
                              </a>
                            </li>
                            <li class="pro-wishlist-icon">
                              <a href="wishlist.html" title="Wishlist">
                                <span></span>
                              </a>
                            </li>
                            <li class="pro-compare-icon">
                              <a href="compare.html" title="Compare">
                                <span></span>
                              </a>
                            </li>
                          </ul>
                        </div>
                      </div>
                    </div>
                  </div>
                  <div class="quick-view">
                    <a class="popup-with-product btn btn-color" href="#product_popup" title="quick-view">
                      <i class="fa fa-eye"></i> Quick View
                    </a>
                  </div>
                </div>
              </div>
              <div class="item plr-20">
                <div class="product-item">
                  <div class="product-item-inner">
                    <div class="product-image">
                      <a href="product-page.html">
                        <img src="images/4.jpg" alt="Shopholic">
                      </a>
                    </div>
                    <div class="product-item-details">
                      <div class="product-item-name">
                        <a href="product-page.html">Dell Laptop Core i5</a>
                      </div>
                      <div class="price-box">
                        <span class="price">$80.00</span>
                        <del class="price old-price">$120.00</del>
                      </div>
                      <div class="rating-summary-block">
                        <div class="rating-result" title="53%">
                          <span style="width:53%"></span>
                        </div>
                      </div>
                      <div class="product-detail-inner">
                        <div class="detail-inner-left align-center">
                          <ul>
                            <li class="pro-cart-icon">
                              <a href="cart.html" title="Add to Cart">
                                <span></span>
                              </a>
                            </li>
                            <li class="pro-wishlist-icon">
                              <a href="wishlist.html" title="Wishlist">
                                <span></span>
                              </a>
                            </li>
                            <li class="pro-compare-icon">
                              <a href="compare.html" title="Compare">
                                <span></span>
                              </a>
                            </li>
                          </ul>
                        </div>
                      </div>
                    </div>
                  </div>
                  <div class="quick-view">
                    <a class="popup-with-product btn btn-color" href="#product_popup" title="quick-view">
                      <i class="fa fa-eye"></i> Quick View
                    </a>
                  </div>
                </div>
              </div>
              <div class="item plr-20">
                <div class="product-item">
                  <div class="main-label sale-label"><span>Sale</span></div>
                  <div class="product-item-inner">
                    <div class="product-image">
                      <a href="product-page.html">
                        <img src="images/5.jpg" alt="Shopholic">
                      </a>
                    </div>
                    <div class="product-item-details">
                      <div class="product-item-name">
                        <a href="product-page.html">Wood Single Table</a>
                      </div>
                      <div class="price-box">
                        <span class="price">$80.00</span>
                        <del class="price old-price">$120.00</del>
                      </div>
                      <div class="rating-summary-block">
                        <div class="rating-result" title="53%">
                          <span style="width:53%"></span>
                        </div>
                      </div>
                      <div class="product-detail-inner">
                        <div class="detail-inner-left align-center">
                          <ul>
                            <li class="pro-cart-icon">
                              <a href="cart.html" title="Add to Cart">
                                <span></span>
                              </a>
                            </li>
                            <li class="pro-wishlist-icon">
                              <a href="wishlist.html" title="Wishlist">
                                <span></span>
                              </a>
                            </li>
                            <li class="pro-compare-icon">
                              <a href="compare.html" title="Compare">
                                <span></span>
                              </a>
                            </li>
                          </ul>
                        </div>
                      </div>
                    </div>
                  </div>
                  <div class="quick-view">
                    <a class="popup-with-product btn btn-color" href="#product_popup" title="quick-view">
                      <i class="fa fa-eye"></i> Quick View
                    </a>
                  </div>
                </div>
              </div>
              <div class="item plr-20">
                <div class="product-item">
                  <div class="product-item-inner">
                    <div class="product-image">
                      <div class="main-label new-label"><span>New</span></div>
                      <a href="product-page.html">
                        <img src="images/6.jpg" alt="Shopholic">
                      </a>
                    </div>
                    <div class="product-item-details">
                      <div class="product-item-name">
                        <a href="product-page.html">Sofa Collection (Blue)</a>
                      </div>
                      <div class="price-box">
                        <span class="price">$80.00</span>
                        <del class="price old-price">$120.00</del>
                      </div>
                      <div class="rating-summary-block">
                        <div class="rating-result" title="53%">
                          <span style="width:53%"></span>
                        </div>
                      </div>
                      <div class="product-detail-inner">
                        <div class="detail-inner-left align-center">
                          <ul>
                            <li class="pro-cart-icon">
                              <a href="cart.html" title="Add to Cart">
                                <span></span>
                              </a>
                            </li>
                            <li class="pro-wishlist-icon">
                              <a href="wishlist.html" title="Wishlist">
                                <span></span>
                              </a>
                            </li>
                            <li class="pro-compare-icon">
                              <a href="compare.html" title="Compare">
                                <span></span>
                              </a>
                            </li>
                          </ul>
                        </div>
                      </div>
                    </div>
                  </div>
                  <div class="quick-view">
                    <a class="popup-with-product btn btn-color" href="#product_popup" title="quick-view">
                      <i class="fa fa-eye"></i> Quick View
                    </a>
                  </div>
                </div>
              </div>
              <div class="item plr-20">
                <div class="product-item">
                  <div class="product-item-inner">
                    <div class="product-image">
                      <div class="main-label sale-label"><span>Sale</span></div>
                      <div class="main-label new-label"><span>New</span></div>
                      <a href="product-page.html">
                        <img src="images/7.jpg" alt="Shopholic">
                      </a>
                    </div>
                    <div class="product-item-details">
                      <div class="product-item-name">
                        <a href="product-page.html">Office Chair (Black)</a>
                      </div>
                      <div class="price-box">
                        <span class="price">$80.00</span>
                        <del class="price old-price">$120.00</del>
                      </div>
                      <div class="rating-summary-block">
                        <div class="rating-result" title="53%">
                          <span style="width:53%"></span>
                        </div>
                      </div>
                      <div class="product-detail-inner">
                        <div class="detail-inner-left align-center">
                          <ul>
                            <li class="pro-cart-icon">
                              <a href="cart.html" title="Add to Cart">
                                <span></span>
                              </a>
                            </li>
                            <li class="pro-wishlist-icon">
                              <a href="wishlist.html" title="Wishlist">
                                <span></span>
                              </a>
                            </li>
                            <li class="pro-compare-icon">
                              <a href="compare.html" title="Compare">
                                <span></span>
                              </a>
                            </li>
                          </ul>
                        </div>
                      </div>
                    </div>
                  </div>
                  <div class="quick-view">
                    <a class="popup-with-product btn btn-color" href="#product_popup" title="quick-view">
                      <i class="fa fa-eye"></i> Quick View
                    </a>
                  </div>
                </div>
              </div>
              <div class="item plr-20">
                <div class="product-item">
                  <div class="product-item-inner">
                    <div class="product-image">
                      <a href="product-page.html">
                        <img src="images/8.jpg" alt="Shopholic">
                      </a>
                    </div>
                    <div class="product-item-details">
                      <div class="product-item-name">
                        <a href="product-page.html">Single Chair Sofa</a>
                      </div>
                      <div class="price-box">
                        <span class="price">$80.00</span>
                        <del class="price old-price">$120.00</del>
                      </div>
                      <div class="rating-summary-block">
                        <div class="rating-result" title="53%">
                          <span style="width:53%"></span>
                        </div>
                      </div>
                      <div class="product-detail-inner">
                        <div class="detail-inner-left align-center">
                          <ul>
                            <li class="pro-cart-icon">
                              <a href="cart.html" title="Add to Cart">
                                <span></span>
                              </a>
                            </li>
                            <li class="pro-wishlist-icon">
                              <a href="wishlist.html" title="Wishlist">
                                <span></span>
                              </a>
                            </li>
                            <li class="pro-compare-icon">
                              <a href="compare.html" title="Compare">
                                <span></span>
                              </a>
                            </li>
                          </ul>
                        </div>
                      </div>
                    </div>
                  </div>
                  <div class="quick-view">
                    <a class="popup-with-product btn btn-color" href="#product_popup" title="quick-view">
                      <i class="fa fa-eye"></i> Quick View
                    </a>
                  </div>
                </div>
              </div>
              <div class="item plr-20">
                <div class="product-item">
                  <div class="product-item-inner">
                    <div class="product-image">
                      <a href="product-page.html">
                        <img src="images/9.jpg" alt="Shopholic">
                      </a>
                    </div>
                    <div class="product-item-details">
                      <div class="product-item-name">
                        <a href="product-page.html">Coupe Watch</a>
                      </div>
                      <div class="price-box">
                        <span class="price">$80.00</span>
                        <del class="price old-price">$120.00</del>
                      </div>
                      <div class="rating-summary-block">
                        <div class="rating-result" title="53%">
                          <span style="width:53%"></span>
                        </div>
                      </div>
                      <div class="product-detail-inner">
                        <div class="detail-inner-left align-center">
                          <ul>
                            <li class="pro-cart-icon">
                              <a href="cart.html" title="Add to Cart">
                                <span></span>
                              </a>
                            </li>
                            <li class="pro-wishlist-icon">
                              <a href="wishlist.html" title="Wishlist">
                                <span></span>
                              </a>
                            </li>
                            <li class="pro-compare-icon">
                              <a href="compare.html" title="Compare">
                                <span></span>
                              </a>
                            </li>
                          </ul>
                        </div>
                      </div>
                    </div>
                  </div>
                  <div class="quick-view">
                    <a class="popup-with-product btn btn-color" href="#product_popup" title="quick-view">
                      <i class="fa fa-eye"></i> Quick View
                    </a>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </section>
  <!-- CONTAINER END -->

    <!-- FOOTER START -->
    <script src="js/foot.js"></script>
    <!-- FOOTER END -->
</div>
<script src="js/jquery-1.12.3.min.js"></script>
<script src="js/tether.min.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/jquery.downCount.js"></script>
<script src="js/jquery-ui.min.js"></script>
<script src="js/fotorama.js"></script>
<script src="js/jquery.magnific-popup.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/custom.js"></script>
<script src="js/common.js"></script>

<script>
    $(function () {
        $("#submit").click(function () {
            $.ajax({
                url: "AddMsgServlet",
                type: "POST",
                data: {MsgContent: MsgContent},

                success: function (data) {
                    console.log(data);
                    alert("增加成功")
                }
            })
        })
    });

    $(function () {
        //商品添加购物车
        $("#addToCart").click(function () {
            $.ajax({
                url: "/addCartServlet",
                type: "POST",
                data: {
                    "goodsId":$("#goodsId").html(),
                    "buyNum":"1"
                },
                dataType: "JSON",
                success: function (data) {
                    if(data){
                        alert("添加成功");
                    }else{
                        alert("库存不足");
                    }
                }
            })
        })
    });

    $(function () {
        getThisGoodsById();
        function getThisGoodsById() {
            var url = document.URL;
            var getValue = url.split("?")[1];
            var goodsId = getValue.split("=")[1];
            $.ajax({
                url:"/getThisGoodsByIdServlet",
                type:"post",
                data:{
                    "goodsId":goodsId
                },
                dataType:"json",
                success:function (data) {
                    $("#goodsName").html(data.goodsName);
                    $("#goodsPrice").html("$"+data.price);
                    $("#goods_price").html("$"+(data.price)*1.2);
                    var imgDiv = "<div id=\"goodsimage\" class=\"fotorama\" data-nav=\"thumbs\" data-allowfullscreen=\"native\">\n" +
                        "             <a href=\"#\"><img src=\"goodsimage/"+data.image+"\" alt=\"Shopholic\"></a>\n" +
                        "         </div>";
                    $("#goodsImages").append(imgDiv);
                    $("#goodsId").append(goodsId);
                    $('.fotorama').fotorama();
                }

            })
        }
    })

    var a = function () {
        $("#aaa").empty();
        $.ajax({
            url:"/GetMsgByGoodsId",
            type: "POST",
            dataType:"JSON",
            success: function (data) {
                $.each(data, function (index, obj) {
                    var fIndex = index;
                    var pinglun = "<li class=\"pinglun\">"+
                        "<div class=\"comment-user\">"+"<img src=\"images/comment-user.jpg\" alt=\"Shopholic\">"+"</div>"+
                        "<div class=\"comment-detail\" id=\"pl\">"+
                        "<div class=\"user-name\">"+obj.user.userName+"</div>"+
                        "<div class=\"post-info\">"+
                        "<ul>"+
                        "<li>"+obj.msgTime+"</li>"+
                        "<li>"+" <a href=\"#\" id=\"reply\">"+"<i >"+"</i>"+"回复"+"</a>"+"</li>"+
                        "</ul>"+
                        "</div>"+
                        "<p>"+obj.conTent+"</p>"+
                        "</div>"+
                        "</li>";
                    $("#aaa").append(pinglun);
                    $.ajax({
                        url:"SelectReplybyMsgId",
                        data:{msgId:obj.msgId},
                        type:"POST",
                        dataType:"JSON",
                        success:function (data) {

                            $.each(data, function (index,reply) {
                                var huifu = "<ul class=\"comment-list child-comment\">"+
                                    "<li>"+"<div class=\"comment-user\">"+"<img src=\"images/comment-user.jpg\" alt=\"Shopholic\">"+"</div>"+
                                    " <div class=\"comment-detail\">"+
                                    "<div class=\"user-name\">"+reply.user.userName+"</div>"+
                                    "<div class=\"post-info\">"+
                                    "<ul>"+
                                    "<li>"+reply.replyTime+"</li>"+
                                    "<li>"+"<a href=\"#\">"+"<i class=\"fa fa-reply\">"+"</i>"+"回复"+"</a>"+"</li>"+
                                    "</ul>"+
                                    "</div>"+
                                    " <p>"+reply.conTent+"</p>"+
                                    "</div>"+
                                    "</li>"+
                                    "</ul>";
                                $(".pinglun").eq(fIndex).append(huifu);
                            })

                        }
                    })

                })
            }
        })

    }
    a();
    $(function () {
        $("#submit").on("click",function () {
            $.ajax({
                url:"AddMsgServlet",
                type:"POST",
                data:{MsgContent:$('#MsgContent').val()},
                dataType:"json",
                success:function (data) {
                    if(data){
                        a();
                    }
                }
            })
        })
    });

    $(document).ready(function(){
        $("#reply").click(function(){
            $("#oldpinglun").remove();
            /* var liuyankuang = "<div class=\"col-12 mb-20 plr-20\">"+
                 "<textarea cols=\"30\" rows=\"3\" id=\"MsgContent\" placeholder=\"发布信息\" required>"+"</textarea>"+
                 "</div>"+
                 " <div class=\"col-12 plr-20\">"+
                 " <button type=\"button\" class=\"btn btn-color\" name=\"submit\" id=\"submit\" >"+"提交"+"</button>"+
                 "</div>";*/
        });
    });
</script>

<script>

</script>
<script>
    var a = function () {
        $("#aaa").empty();
        $.ajax({
            url:"/GetMsgByGoodsId",
            type: "POST",
            dataType:"JSON",
            success: function (data) {
                $.each(data, function (index, obj) {
                    var fIndex = index;
                    var pinglun = "<li class=\"pinglun\">"+
                        "<div class=\"comment-user\">"+"<img src=\"images/comment-user.jpg\" alt=\"Shopholic\">"+"</div>"+
                        "<div class=\"comment-detail\" id=\"pl\">"+
                        "<div class=\"user-name\">"+obj.user.userName+"</div>"+
                        "<div class=\"post-info\">"+
                        "<ul>"+
                        "<li>"+obj.msgTime+"</li>"+
                        "<li>"+" <a href=\"#\" id=\"reply\">"+"<i >"+"</i>"+"回复"+"</a>"+"</li>"+
                        "</ul>"+
                        "</div>"+
                        "<p>"+obj.conTent+"</p>"+
                        "</div>"+
                        "</li>";
                    $("#aaa").append(pinglun);
                    $.ajax({
                        url:"SelectReplybyMsgId",
                        data:{msgId:obj.msgId},
                        type:"POST",
                        dataType:"JSON",
                        success:function (data) {
                            $.each(data, function (index,reply) {
                                var huifu = "<ul class=\"comment-list child-comment\">"+
                                    "<li>"+"<div class=\"comment-user\">"+"<img src=\"images/comment-user.jpg\" alt=\"Shopholic\">"+"</div>"+
                                    " <div class=\"comment-detail\">"+
                                    "<div class=\"user-name\">"+reply.user.userName+"</div>"+
                                    "<div class=\"post-info\">"+
                                    "<ul>"+
                                    "<li>"+reply.replyTime+"</li>"+
                                    "<li>"+"<a href=\"#\">"+"<i class=\"fa fa-reply\">"+"</i>"+"回复"+"</a>"+"</li>"+
                                    "</ul>"+
                                    "</div>"+
                                    " <p>"+reply.conTent+"</p>"+
                                    "</div>"+
                                    "</li>"+
                                    "</ul>";
                                $(".pinglun").eq(fIndex).append(huifu);
                            })

                        }
                    })

                })
            }
        })
    };
    a();
    $(function () {
        $("#submit").on("click",function () {
            $.ajax({
                url:"AddMsgServlet",
                type:"POST",
                data:{MsgContent:$('#MsgContent').val()},
                dataType:"json",
                success:function (data) {
                    console.log(data);
                    if(data){
                        a();
                    }
                }
            })
        })
    })


    $(document).ready(function(){
        $("#reply").click(function(){
            $("#oldpinglun").remove();
            /* var liuyankuang = "<div class=\"col-12 mb-20 plr-20\">"+
                 "<textarea cols=\"30\" rows=\"3\" id=\"MsgContent\" placeholder=\"发布信息\" required>"+"</textarea>"+
                 "</div>"+
                 " <div class=\"col-12 plr-20\">"+
                 " <button type=\"button\" class=\"btn btn-color\" name=\"submit\" id=\"submit\" >"+"提交"+"</button>"+
                 "</div>";*/
        });
    });
</script>

</body>
</html>
